<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>个人中心</title>
    <link rel="stylesheet" type="text/css" media="screen" href="/layui/css/layui.css"/>
</head>
<body>
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
    <ul class="layui-tab-title">
        <li>我的信息</li>
        <li>我的钱包</li>
        <li>订单管理</li>
    </ul>
    <div class="layui-tab-content" style="margin: 0;height: 100%;padding: 0;">
        <div class="layui-tab-item layui-show">1</div>
        <div class="layui-tab-item">
            2
        </div>
        <div class="layui-tab-item">
            <div class="layui-tab layui-tab-card" style="height: 100% ;margin: 0;">
                <ul class="layui-tab-title">
                    <li>全部</li>
                    <li>未付款</li>
                    <li>已完成</li>
                    <li>已取消</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">1</div>
                    <div class="layui-tab-item">2</div>
                    <div class="layui-tab-item">3</div>
                    <div class="layui-tab-item">4</div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="layui/layui.js"></script>
<script>
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function () {
        const element = layui.element;

        //…
    });
</script>
</body>
</html>